<template>
    <div>
        <div>----------以下是代办清单----------</div>
        <h3>{{msgFromChild}}</h3>
        <input v-model="text"/>
        <button @click="clearInput">清空</button>
        <button @click="$emit('addList', text)">提交</button>
        <button @click="$emit('removeAll')">重置清单</button>
    </div>
</template>
<script>
import { onMounted, ref } from "vue";
import bus from 'vue3-eventbus';
export default {
    props: {
        titel:String
    },
    setup(){
        const msgFromChild=ref("");
        const text = ref("");
        const clearInput = () => {
            text.value = "";
        };
        onMounted(() => {
            bus.on("getMsg", msg => {
                console.log("触发getMsg")
                msgFromChild.value = msg;
            })
        })
        return{
            msgFromChild,
            text,
            clearInput
        }
    }
}
</script>